import React, {Component, createRef,RefObject} from 'react';
import {Button, Form, FormInstance, Input, Space,message} from "antd";
import '../static/css/login.css'
import {login} from "../api/login";
import {set} from "../utils/storage";
import {applicationConfiguration} from "../api/abp";

const layout = {
  labelCol: { span: 8 },
  wrapperCol: { span: 16 },
};
const tailLayout = {
  wrapperCol: { offset: 8, span: 16 },
};

class Login extends Component {
    formRef: RefObject<FormInstance>
    constructor(props: any, context: any) {
        super(props, context);
        this.formRef = createRef<FormInstance>()
    }
    login =async (form: any) => {
        console.log('form', form)
        let res = await login({
            grant_type: "password",
            issuer: "https://localhost:44367",
            // redirectUri: "http://localhost:44370",
            redirectUri: "http://localhost:555",
            responseType: "code",
            scope: "offline_access openid profile role email phone AbpStudy",
            username: "admin",
            password: "1q2w3E*",
            client_id: "AbpStudy_App",
            client_secret: "1q2w3e*",
        });
        if (res.status === 200) {
            let data = res.data;
            let token = data.access_token;
            set('token',token) // localStorage 存储 token
            await this.getAbpConfig()

        }else{
            message.error("请求失败")
        }

    }
    getAbpConfig= async () => {
        let res = await applicationConfiguration();
        if (res.status === 200) {
            // 获取语言和 中英文对照
            const language = res.data.localization.currentCulture.cultureName
            const values = res.data.localization.values
            console.log('language', language)
            console.log('values', values)
            //todo 语言后面在整
        }else{
            message.error("getAbpConfig失败")
        }
    }

    render() {
        return (
            <Form id={"login-form"} {...layout} ref={this.formRef}
                  onFinish={(e)=>this.login(e)}
            >
                <Form.Item
                    label={'用户名'}
                    name={'name'}
                    rules={[
                        {
                            type: 'string',
                            required: true,
                        }
                    ]}
                ><Input/></Form.Item>
                <Form.Item label={'密码'} name={'password'}><Input.Password/></Form.Item>
                <Form.Item {...tailLayout}>
                    <Space>
                        <Button type={"primary"} htmlType={"submit"}>登录</Button>
                        <Button type={"primary"} htmlType={"reset"}>重置</Button>
                    </Space>
                </Form.Item>

            </Form>
        );
    }
}

export default Login;
